<template>
	<div id="notice_detail">
		<div class="form">
			<div class="row">
				<label class="label">通知标题：</label>
				<span class="span">{{notice.title}}</span>
			</div>
			<div class="row">
				<label class="label">通知内容：</label>
				<span class="span" style="white-space: pre-line;">{{notice.content}}</span>
			</div>
			<div class="row">
				<label class="label">发送给：</label>
				<span class="span people">
					{{receiverNames}}
				</span>
				<!--<el-button type="text" class="detail_btn">人员详情</el-button>-->
				<!--<span class="detail_btn">人员详情</span>-->
			</div>
			<div class="row">
				<label class="label">发送时间：</label>
				<span class="span">{{notice.publishTime}}</span>
			</div>
			<div class="row">
				<label class="label">创建时间：</label>
				<span class="span">{{notice.createTime}}</span>
			</div>
			<div class="row">
				<label class="label">发送人：</label>
				<span class="span">{{notice.sendUserName}}</span>
			</div>
		</div>
	</div>
</template>

<script>
var vm,dict;
export default {
	data : function() {
		return {
			notice : {},
			receiverNames: "",
		}
	},
	methods : {
		init : function(notice) {
			vm.notice = notice;
			
			api.messageInfo({messageId: notice.messageId}).then(function(data) {
				//全部校区
				if(data.info.receiverType == 0) {
					vm.receiverNames = "全部校区";
					return;
				}
				//部分校区或人员
				let names = "";
				data.info.receiverList.forEach(function(item) {
					names += "，" + item.name;
				})
				vm.receiverNames = names.substring(1);
			});
		},
		cancel : function() {
			vm.$emit("cancel");
		},
	},
	created : function() {
		vm = this;
	}
}
</script>
<style scoped>
	.form {
		font-size: 0.16rem;
		color: #666666;
		line-height: 0.26rem;
		letter-spacing: 0.01rem;
	}
	.row {
		padding: 0.06rem 0;
		overflow: hidden;
		/*outline: 1px solid;*/
	}
	.label {
		display: inline-block;
		width: 0.95rem;
		text-align: right;
		font-weight: bold;
		vertical-align: top;
		/*outline: 1px solid blue;*/
	}
	.span {
		float: right;
		display: inline-block; 
		width: 6.35rem;
	}
	.people {
		display: -webkit-box;
		-webkit-box-orient: vertical; 
		-webkit-line-clamp: 3;  
		text-overflow: ellipsis;
		overflow: hidden;
	}
	.detail_btn {
		margin-left: 1rem;
		line-height: 0.36rem;
		padding: 0;
	}
</style>